<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <style>
        label {
            display: inline-block;
            width: 50px;
        }

        div {
            margin-bottom: 10px;
        }
    </style>
</head>

<body>
    <h1>登录</h1>
    <form action="">
        <div>
            <label for="">账号</label>
            <input type="text">
        </div>
        <div>
            <label for="">密码</label>
            <input type="text">
        </div>
        <div>
            <label for=""></label>
            <input type="button" value="注册">
        </div>
    </form>

    <script>
        const ipt = document.querySelectorAll('input')[0];
        const pwd = document.querySelectorAll('input')[1];
        const btn = document.querySelectorAll('input')[2];

        btn.onclick = function () {
            let arr = JSON.parse(localStorage.getItem('users'));
            let result = arr.filter(item => item.id == ipt.value && pwd.value == item.password)[0];
            if (result) {
                console.log("成功");
            } else {
                console.log("失败");
            }
        }
    </script>
</body>

</html>